<script setup>

import {inject, onMounted, ref} from "vue";
import {doGet} from "@/util/request.js";
import {useRoute, useRouter} from "vue-router";

//引入路由
const router = useRouter()
const route = useRoute()
//刷新页面
const refresh = inject('refresh')

// 新增商户
const onAddUser = () => {
  //跳转
  router.push('/index/user/edit')
}
// 分页参数
const onPageChange = (number) => {
  loadUserInfo(number)
}
let totalPage = ref(1)

// 用户列表数据
const userTableData = ref([])

// 分页查询
//查询商户信息
const loadUserInfo = (pageNo) => {
  //准备参数
  const params = {
    pageNo: pageNo,
    pageSize: 15
  }
  doGet('/user/pageList', params).then((resp) => {
    if (resp.data.code === 200) {
      userTableData.value = resp.data.data.list
      totalPage.value = resp.data.data.page.totalPages
    }
  })
}


//修改商户
const onUserEdit = (userNo) => {
  //跳转
  router.push('/index/user/edit/' + userNo)
}

onMounted(() => {
  loadUserInfo(1)
})

</script>

<template>

  <el-button type="success" size="small" @click="onAddUser">新增离线商户</el-button>

  <el-table
      ref="userTable"
      :data="userTableData"
      border
      stripe
      style="width: 100%;margin-top: 15px">
    <el-table-column prop="userNo" label="商户号" width="220" align="center"/>
    <el-table-column prop="loginName" label="登录名称" width="110" align="center"/>
    <el-table-column prop="accountNo" label="资金账号" width="220" align="center"/>
    <el-table-column prop="phone" label="手机号" width="120" align="center"/>
    <el-table-column prop="shopName" label="商户名称" width="150" align="center"/>
    <el-table-column prop="shopScope" label="经营范围" width="280" align="center"/>
    <el-table-column prop="userEmail" label="邮箱" width="180" align="center"/>
    <el-table-column prop="status" label="状态" width="130" align="center"/>
    <el-table-column prop="createTime" label="创建时间" width="260" align="center"/>
    <el-table-column label="操作" align="center">
      <!--编辑&详情&删除按钮-->
      <template #default="scope">
        <el-button size="small" plain type="success" @click="onUserEdit(scope.row.userNo)">修改</el-button>
      </template>
    </el-table-column>
  </el-table>
  <!--分页-->
  <el-pagination
      background
      size="small"
      layout="prev, pager, next"
      :page-count="totalPage"
      :page-size="20"
      style="margin-top: 15px"
      @current-change="onPageChange"/>

</template>

<style scoped>

</style>